<template>
  <view class="container">
    <div class="page-top "></div>

    <view style="width: 90%;margin: auto">
      <view class="add_car" @click="add_pet">
        <van-row>
          <van-col span="4">
            <view><van-icon name="add-o" size="30px"/></view>
          </van-col>
          <van-col span="20">
            <view class="item_label"><text>添加宠物</text></view>
          </van-col>
        </van-row>
      </view>

      <view class="detail" v-for="(pet,index) in pets" :key="index">
        <van-row>
          <van-col span="4">
            <view><img src="/images/m1.png" class="kbimg"></view>
          </van-col>
          <van-col span="20">
            <view class="name"><text>{{ pet.pet_name }}（{{ pet.type_name }}）</text></view>
            <view class="name"><text>重{{ pet.weight }}千克</text></view>
          </van-col>
        </van-row>
        <van-divider />
        <view style="text-align: right">
          <van-button round color="#6173ad" size="small" style="margin-right: 10px" @click="onEditPet(pet.id)">修改</van-button>
          <van-button round color="#ff9800" size="small" @click="onDelPet(pet.id)">删除</van-button>
        </view>
    </view>

  </view>






  </view>
</template>

<script>

import {delPet, getPets} from "../../../requests/user/pet";
import {showToast} from "../../../requests/tools";

var $this;
export default {

  data() {
    // 这里存放数据
    return {
      pets: []
    }
  },
  // 方法集合
  methods: {
    onGetPet() {
      getPets().then(res => {
        console.log(res);
        $this.pets = res.data.list;
      })
    },
    onEditPet(id){
      mpvue.navigateTo({
        url: "/pages/user/pet/add/main?id=" + id,
      })
    },
    onDelPet($id) {
      wx.showModal({
        title: '提示',
        content: '是否删除',
        success(res) {
          if (res.confirm) {
            delPet($id).then(res => {
              showToast(res.code === 0, res.msg);
              $this.onGetPet();
            })
          }
        }
      })
    },
    add_pet() {
      mpvue.navigateTo({
        url: "/pages/user/pet/add/main",
      })
    }
  },
  created() {
    $this = this;
  },
  onShow() {
    /**
     * 获取宠物列表
     */
    $this.onGetPet();
  },
}
</script>

<style>
@import "index.css";

</style>
